@import "vars";

// Preview Image

.jw-click {
    position: absolute;
    width: 100%;
    height: 100%;
}

.jw-preview {
    position: absolute;
    display: none;
    opacity: 1;
    visibility: visible;
    width: 100%;
    height: 100%;
    background: #000 no-repeat 50% 50%;
}

.jwplayer,
.jw-error,
.jw-stretch-uniform {
    .jw-preview {
        background-size: contain;
    }
}

.jw-stretch-none {
    .jw-preview {
        background-size: auto auto;
    }
}

.jw-stretch-fill {
    .jw-preview {
        background-size: cover;
    }
}

.jw-stretch-exactfit {
    .jw-preview {
        background-size: 100% 100%;
    }
}

// DisplayIcon
.jw-display-icon-container {
    position: relative;
    top: 50%;
    display: table;
    height: @display-icon-container-size;
    width: @display-icon-container-size;
    margin: @display-icon-container-size/-2 auto 0;
    cursor: pointer;

    .jw-icon-display {
        position: relative;
        display: table-cell;
        text-align: center;
        vertical-align: middle !important;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        font-size: 2.5em;
    }

    .jw-breakpoint-0 & {
      height: @mobile-touch-target;
      width: @mobile-touch-target;
      margin: (@mobile-touch-target / -2) auto 0;

      .jw-icon {
        font-size: (@mobile-touch-target / 2);
      }
    }

    .jw-breakpoint-1 & {
      height: @mobile-touch-target * 1.25;
      width: @mobile-touch-target * 1.25;
      margin: ((@mobile-touch-target * 1.25) / -2) auto 0;

      .jw-icon {
        font-size: (@mobile-touch-target / 1.25);
      }
    }
}

// Hide the player when,
.jw-flag-audio-player, // Audio only mode
.jw-flag-dragging {     // Scrubbing
  .jw-display-icon-container {
    display:none;
  }
}
